<template>
	<view>
	<view>
		<uni-nav-bar shadow left-icon="left" dark title="合同查看"@clickLeft="back()" />
		<uni-row >
			<uni-col :span="8"><uni-easyinput class="uni-mt-5" suffixIcon="search"  v-model="ProcurementContractForm.contractNum" placeholder="合同编号" @iconClick="iconClick" ></uni-easyinput></uni-col>
			<uni-col :span="8"><uni-easyinput class="uni-mt-5" suffixIcon="search"  v-model="ProcurementContractForm.contractName" placeholder="合同名称" @iconClick="iconClick"></uni-easyinput></uni-col>
			<uni-col :span="8"> 
	<uni-data-select
      v-model="ProcurementContractForm.contractStatus"
      :localdata="range"
      @change="change"
    ></uni-data-select></uni-col>
		</uni-row>
	</view>	
	<view v-for="(item,index) in tableProcurementContract" :key="index">
		<uni-card >
		<uni-row class="box" >
			<text style="font-weight: 600;">合同编号:</text>{{item.contractNum}}
		</uni-row>
		<uni-row class="box" >
			<text style="font-weight: 600;">合同名称:</text>{{item.contractName}}
		</uni-row>	
	
		<uni-row class="box">
			<text style="font-weight: 600;">合同类型:</text>{{item.contractType}}
		</uni-row>
		<uni-row class="box">
				<view  v-if="item.contractStatus==0"><text style="font-weight: 600;">合同状态:</text><text>未提交</text></view>
				<view  v-if="item.contractStatus==1"><text style="font-weight: 600;">合同状态:</text><text >已提交</text></view>
				<view  v-if="item.contractStatus==2"><text style="font-weight: 600;">合同状态:</text><text>已通过</text></view>
				<view  v-if="item.contractStatus==3"><text style="font-weight: 600;">合同状态:</text><text>已驳回</text></view>
		</uni-row>
        <uni-row style="text-align: center;"><button size="mini" type="primary" @click="contract_detail(tableProcurementContract[index])">查看详细</button></uni-row>
		</uni-card>
	
	</view>
	
	</view>
</template>

<script>
	import {ProcurementContractTable} from '@/api/system/user.js'
	export default {
		data() {
			return {
				ProcurementContractForm:{
					page: 1,
					rows: 20,
					contractNum:null,
					contractName:null,
					contractStatus:"2",
				},
              
                range: [
					{"value":"2","text": "已通过"},
					], 		
				tableProcurementContract:null,
			}
		},
		onLoad() {
			this.get()
		},
		methods: {
			change(){
			    // this.ProcurementContractForm.page=1
				this.get()
			},
			iconClick(){
				// this.ProcurementContractForm.page=1
				this.get()
			},
			get(){
				ProcurementContractTable(this.ProcurementContractForm).then(res=>{
				this.tableProcurementContract=res.rows
				})
			},
			
		back(){
				this.$tab.reLaunch('/pages/work/supplier/index')
		},
		contract_detail(e){
			uni.navigateTo({
			       url: '/pages/work/supplier/contract_detail',
			       success: (respost) => {
			           // 通过eventChannel向被打开页面传送数据
			           respost.eventChannel.emit('acceptDataFromOpenerPage', {data:e},
					   )}
			     });
			
		}
		}
	}
</script>

<style>
.box {
 /*强制文本在一行内显示*/
 white-space:nowrap; 
 overflow:hidden; 
 text-overflow:ellipsis
}
</style>
